<template>
    <div>
        <div class="top">
            <van-icon name="arrow-left" size="1.9rem" class="left" @click="$router.back()" />
            <span class="text">{{title}}</span>
            <van-icon :name="iconnam"  size="2rem" class="rigeht" @click="$router.push(`${paths}`)" />
        </div>
    </div>
</template>

<script>
export default {
    name: 'App02NavBar',

    data() {
        return {  
        };
    },
    props:['title','iconnam','paths'],
    mounted() {
        // console.log(this.paths)
    },

    methods: {
        
    },
};
</script>

<style lang="scss" scoped>
.top{
    width: 100%;
    height: 50px;
    background-color: #07c160;
    color: white;
    // position: fixed;
    top: 0;
    display: flex;
    // z-index: -999;
    // margin-bottom: 150px;
    /*定义子级元素垂直居中*/
    align-items: center;
    position: fixed;
    z-index: 100;

    .text{
        font-size: 20px;
        text-align: center;
        margin: auto;
    }
    .left{
        position: absolute;
        left: 15px;
        top: 10px;
    }
    .rigeht{
        position: absolute;
        right: 15px;
        top: 10px;
    }
}
</style>